// 响应式断点
@mixin respond-to($breakpoint) {
    @if map-has-key($breakpoints, $breakpoint) {
        @media screen and (min-width: map-get($breakpoints, $breakpoint)) {
            @content;
        }
    }
}

// flex布局
@mixin flex($direction: row, $justify: flex-start, $align: stretch, $wrap: nowrap) {
    display: flex;
    flex-direction: $direction;
    justify-content: $justify;
    align-items: $align;
    flex-wrap: $wrap;
}

// 文本省略
@mixin text-ellipsis($lines: 1) {
    @if $lines == 1 {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    } @else {
        display: -webkit-box;
        -webkit-line-clamp: $lines;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

// 滚动条样式
@mixin scrollbar($width: 6px, $thumb-color: rgba(0, 0, 0, 0.3), $track-color: transparent) {
    &::-webkit-scrollbar {
        width: $width;
        height: $width;
    }

    &::-webkit-scrollbar-thumb {
        background: $thumb-color;
        border-radius: $width / 2;
    }

    &::-webkit-scrollbar-track {
        background: $track-color;
    }
}

// 渐变背景
@mixin gradient($start-color, $end-color, $direction: to right) {
    background: linear-gradient($direction, $start-color, $end-color);
}

// 阴影
@mixin box-shadow($level: 1) {
    @if $level == 1 {
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    } @else if $level == 2 {
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    } @else if $level == 3 {
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
    }
}
